import { EngiGis } from '../core/index';
import { getToken } from '../core/utils';
import { ObjectModelManager } from '../core/model';
import { BizUnitType, ModelObjType } from '../core';
// import { heatplantRender } from './biz/heatplant-biz';
import logger from 'loglevel';
import { WarningBizUnit } from './warningBizUnit';
import { MarkerBizUnit } from './markerBizUnit';
import { LineBizUnit } from './lineBizUnit';

// 声明全局变量和类型，使 TypeScript 能够识别它们
// eslint-disable-next-line @typescript-eslint/no-unused-vars
declare const uiWidgets: {
  layersControlUi: {
    onChange: (list: { value: string; checked: boolean }[]) => void;
    list: { value: string; checked: boolean }[];
  };
  pidControlUi: {
    value: boolean;
    onChange: (value: boolean) => void;
  };
  zoomUi: {
    value: number | string;
  };
  objInfoUpdateUi: {
    jumpTo(pid: string): void;
    update(objInfo: { pid: string; key: string; value: string | number }): void;
  };
  mapControlUi: {
    fitView(): void;
    toggleZoomBox(): void;
  };
};

// 为 Window 接口添加 uiWidgets 属性
declare global {
  interface Window {
    uiWidgets: typeof uiWidgets;
  }
}

// 3. 初始化模型对象管理器
async function initModel() {
  const objectModelManager = new ObjectModelManager();
  await engiGis.initBuiltInBizUnits(
    objectModelManager,
    'myproject',
    '00',
    [],
    1,
  );

  // 图层控制： 显示哪些对象
  initLayersControlUi();
  // 实测参数控制： 是否显示pid文字
  initPidControlUi();
  // 实时数据更新： 对象信息更新
  initObjControlUi();
  // 地图控制： 适配全部内容、切换拉框缩放状态
  initMapControlUi();

  // const warningBizUnit = new WarningBizUnit(engiGis);
  // engiGis.addBizUnit(warningBizUnit, {
  //   sort: 1,
  // });

  // let tick = 0;
  // setInterval(() => {
  //   console.log('开始更新告警数据');
  //   // 更新告警实时数据
  //   engiGis.updateRealTimeData([
  //     {
  //       unitType: 'warning',
  //       update: [
  //         {
  //           id: 'warning.1',
  //           properties: {
  //             name: '告警点1',
  //             rt_state: tick++ % 2 === 0 ? 'normal' : 'error',
  //           },
  //         },
  //       ],
  //     },
  //   ]);

  //   if (tick === 10) {
  //     // 更新告警地理数据
  //     warningBizUnit.updateGeoData(null, [
  //       {
  //         type: 'Feature',
  //         geometry: {
  //           type: 'Point',
  //           coordinates: [116.98392791512401, 36.66390112537448],
  //         },
  //         id: 'warning.1',
  //         properties: {
  //           name: '告警点1',
  //           type: 'warning',
  //           rt_state: 'normal',
  //         },
  //       },
  //     ]);
  //   }
  // }, 750);

  const myLineBizUnit = new LineBizUnit(engiGis);
  engiGis.addBizUnit(myLineBizUnit, {
    sort: 2,
  });
  console.log('myLineBizUnit', myLineBizUnit);

  // marker
  const markerBizUnit = new MarkerBizUnit(engiGis);
  engiGis.addBizUnit(markerBizUnit, {
    sort: 3,
  });
}

function setZoomText(zoom: number) {
  const { zoomUi } = window.uiWidgets;
  zoomUi.value = zoom.toFixed(2);
}

// 初始化图层显隐UI
function initLayersControlUi() {
  const { layersControlUi } = window.uiWidgets;
  const checkBoxListHandler = (list: { value: string; checked: boolean }[]) => {
    engiGis.updateLayersVisible(
      list
        .slice(1)
        .map((item) => ({
          modelType: item.value as ModelObjType,
          visible: item.checked,
        })),
    );
  };
  layersControlUi.onChange = checkBoxListHandler;
  checkBoxListHandler(layersControlUi.list); // 初始化时设置复选框状态
}

const showTextHandle = (checked: boolean) => {
  const showTextList = ['name'];
  if (checked) {
    showTextList.push('pid');
  }
  engiGis.showText(showTextList);
};
function initPidControlUi() {
  const { pidControlUi } = window.uiWidgets;
  // 初始化 PID 控制 UI
  pidControlUi.onChange = (value: boolean) => {
    showTextHandle(value);
  };
  showTextHandle(pidControlUi.value); // 初始化时设置显示状态
}

function initObjControlUi() {
  const { objInfoUpdateUi } = window.uiWidgets;
  // 初始化对象信息更新 UI
  objInfoUpdateUi.jumpTo = (pid: string) => {
    engiGis.flyToObject(pid);
  };
  objInfoUpdateUi.update = (objInfo) => {
    const { pid, key, value } = objInfo;
    const unitType = pid.split('.')[0] as BizUnitType;

    // 验证必填字段
    if (!pid || !key) {
      throw new Error('请输入对象ID和属性键');
    }

    // 尝试解析值，支持数字、布尔值和字符串
    let parsedValue: string | number | boolean = value;
    if (value === 'true') {
      parsedValue = true;
    } else if (value === 'false') {
      parsedValue = false;
    } else if (!isNaN(Number(value))) {
      parsedValue = Number(value);
    }

    logger.info(
      `准备更新对象 ${pid} (${unitType}) 的 ${key} 属性为: ${parsedValue}`,
    );

    // 调用实时数据更新方法
    const updateObj = {
      id: pid,
      properties: {
        [key]: parsedValue,
      },
    };
    engiGis.updateRealTimeData([
      {
        unitType,
        update: [updateObj],
      },
    ]);
  };
}

function initMapControlUi() {
  const { mapControlUi } = window.uiWidgets;

  // 初始化地图控制 UI
  mapControlUi.fitView = () => {
    console.log('开始适配全部内容...');
    engiGis.fitAllContent({
      duration: 1500,
    });
  };

  mapControlUi.toggleZoomBox = () => {
    console.log('切换拉框缩放状态');
    return engiGis.zoom.toggleBoxZoom({
      boxStyle: {
        borderColor: '#3388ff',
        borderWidth: 2,
        backgroundColor: 'rgba(51, 136, 255, 0.15)',
      },
    });
  };
}

// 1. 初始化 EngiGis 渲染器
const engiGis = new EngiGis(
  'app',
  // 地图配置
  {
    // type: 'localPng', // 'tianditu' | 'localPng' | 'localMbTiles'
    // tilesPath:
    //   'http://172.16.0.242:31200/storage-service/download/resource/{z}/{x}/{y}.png?token=' +
    //   getToken(), // 本地图片路径
    type: 'tianditu'
  },
  // 其他配置
  {
    navigationControlPosition: 'bottom-right', // 导航控件位置
  },
); // 实例对象 { mapboxInstance

// 在地图加载完成后显示导航控件（包含缩放按钮）
engiGis.map.on('load', () => {
  // 显示缩放级别
  engiGis.zoom.onZoomChange((zoom) => setZoomText(zoom));
  setZoomText(engiGis.zoom.getZoom());

  engiGis.bus.on('click:layer', (e: any) => {
    logger.info('点击图层:', e);
  });
});

// 2. 初始化模型
initModel();
